<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="es" lang="es">
	<head>
		<title>Wiki Symbols</title>
		<link rel="stylesheet" type="text/css" href="css/estil.css" />
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
		<meta name="description" content="Wiki Symbols" />
		<meta name="author" content="Belén Gómez Casellas,Cristina Bosom Fernández">
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> 
        <script src="http://jquery.malsup.com/form/jquery.form.js"></script> 
        <script src="jquery.js" type="text/javascript"></script>
        <script src="canvasPaint.js" type="text/javascript"></script>
        <script type="text/javascript">
            var canvasManager;
            $(window).load(function () {
                canvasManager = $(".canvas").canvasPaint();
            });

            //para div dinámico ( hace como de iframe pero con altura variable)
          $(document).ready(function() { // contenido central dinámico
        canvasManager = $(".canvas").canvasPaint();
                 var url = "./";
                $('a').click(function(e) {
                    // alert("hola");
                    e.preventDefault(); // Previene la acción por defecto, que sería enviarte a otra página
                    var href = url + $(this).attr('href'); // Esta línea extrae el contenido del atributo href del enlace clickeado
                    //alert("href"+href);
                    $('#principal').empty(); // Limpia el div 'principal'
                    $('#principal').load(href); // Esta línea  carga el contenido dentro del div 'contenido'
                });
    
             $("form").submit( function (e){	
                    e.preventDefault(); 
                    return false;
                    alert("SUBMIT");
                    //$('#contenido').empty(); // Limpia el div 'contenido'  
                    var href= (this).attr('action');
                    $('#contenido').empty(); // Limpia el div 'contenido'
                    $('#contenido').load(href); // Esta línea simplemente carga el contenido dentro del div 'contenido'
                    //return false; //Si devolvemos false, el formulario ya no se enviará.
                    });
        }); 
    
        </script>
	</head>
	<body>
	
		<div id="contenedor">
			<div id="cabecera">
				<!--<a href="./">Wiki Symbol</a>-->
                Wiki Symbol
			</div> <!-- /cabecera -->
			<div id="menu">
				<ul>
					<li><a href="" onclick=" window.location.reload();">Inicio</a></li>
					<li><a href="buscadorNombre.html">Buscar por nombre</a></li>
					<li><a href="sobre.html">Sobre Wiki Symbols</a></li>
                    <li><a href="contacto.html">Contacto</a></li>
				</ul>
		 	</div>
			<br />
            <div id="principal"> <!-- --><!-- -->
            	<div>
                    <table class="tabla">
                        <tr>
                            <td>
                            <span class="toolsBar"> <h3>Herramientas de dibujo</h3></span>
                                <button onclick="canvasManager.activatePen()">
                                <img alt="herramienta lápiz" src="imagenes/lapiz.png" height="30"/>
                                </button>
                                <button onclick="canvasManager.activateEmptyCircle()">
                                <img alt="herramienta circulo" src="imagenes/circulo.png" height="30"/>
                                </button>
                                <button onclick="canvasManager.activateEmptyRectangle()">
                                <img  alt="herramienta rectángulo"src="imagenes/cuadrado.png" height="30"/>
                                </button>
                                <button onclick="canvasManager.activateLine()">
                                <img alt="herramienta linea" src="imagenes/linea.png" height="30"/>
                                </button>
                            <br />
                            <div id="oCanvas" class="canvas"></div>
                            <button onClick="envia()">Buscar</button>
                            <div id="coord"> </div>
                            </td>
                            <td>
                            	<div id="texto" class="intro"> 
                                	¿Alguna vez has visto un simbolo que no reconocías, y no has podido averiguar su significado o historia porque no sabías el nombre?<br />
Wiki Symbols es la herramienta adecuada para ello. Puedes dibujar el símbolo para averiguar su nombre e historia.<br />
<br />
<br />

<br />
<br />

<p class="instrucciones">Instrucciones para optimizar la búsqueda:<br /><br />

-Cuando el símbolo contenga una circunferencia, cuadrado, o recta, usa las herramientas corresponientes para dibujarla.<br /><br />

-Todo lo dibujado debe estar dentro del marco de dibujo.<br /><br />



-No modifiques el zoom del explorador.<br /><br />

-Dibuja lo mejor que puedas.
<br /></p>


                                </div>
                            	
                            </td>
                            </tr>
                	</table>
            	</div>
    
        	 </div><!-- /principal -->       
             <!-- Pie de página -->
         <div id="pie">
             <span>&copy; Wiki Symbols</span>
         </div> <!-- /pie de página -->
        
       </div> <!-- /contenedor -->
    </body>
</html>